<template>
	<block>
		<hxt-layout id="hxt-layout" title="电影票房排行" svc="piaofang" initTitle="电影票房排行加载失败" @initPage="initPage">
			<view class="hxt-flex-column" style="background-color: #fff;">
				<!-- <van-dropdown-menu active-color="#1989fa">
					<van-dropdown-item :value="idx" :options="urlList" @change="change"></van-dropdown-item>
				</van-dropdown-menu> -->
				<view class="hxt-flex-fill" style="overflow: hidden;">
					<hxt-scroll ref="scrollEL" id="scrollEL" scroll-y style="height:100%;" scroll-with-animation="true"
						enable-back-to-top="true" :enhanced="true" :bounces="false" @loadData="loadData">
						<view v-for="(item,index) in list" :key="index" style="margin: 20rpx;">
							<van-card :tag="index+1" thumb="https://img01.yzcdn.cn/vant/ipad.jpeg">
								<view slot="title" style="font-size: 30rpx;font-weight: 700;">
									{{item.title}}
								</view>
								<view slot="desc" style="visibility: hidden;">
									{{item.releaseInfo}}
								</view>
								<view slot="tags">
									{{item.releaseInfo}}
								</view>
								<view slot="price" style="color: #ee0a24;font-size: 30rpx;font-weight: 700;">
									{{item.sumBoxDesc}}
								</view>
							</van-card>
						</view>
					</hxt-scroll>
				</view>
			</view>
		</hxt-layout>
		<hxt-loading id="hxt-loading"></hxt-loading>
	</block>
</template>

<script>
	import hxt from "@/utils/hxt.js"
	export default {
		data() {
			return {
				list: []
			}
		},
		onShow: function(e) {},
		methods: {
			initPage: function(e) { //初始化事件
				var _this = this;
				_this.loadData();
			},
			loadData: function(e) {
				var _this = this;
				if (!e || e.refresh) {
					// _this.list = [];
				};
				hxt.loading(true);
				hxt.post({
					url: 'https://api.suyanw.cn/api/piaofang.php?type=json',
					data: {},
					ok: function(res) {
						if (res.statusCode != 200) {
							hxt.Notify({
								type: 'danger',
								message: '加载失败：' + res.errMsg + '，请稍后重试！'
							});
							_this.$refs.scrollEL.refreshDone(false);
							return;
						};
						_this.list = res.data.data;
						hxt.loading(false);
						_this.$refs.scrollEL.refreshDone(false);
					},
					fail: function(res) {
						hxt.Notify({
							type: 'danger',
							message: '加载失败：' + res.errMsg + '，请稍后重试！'
						});
						_this.$refs.scrollEL.refreshDone(false);
					}
				});
			},
		}
	}
</script>

<style>

</style>
